<div class="layui-card">
    <div class="layui-card-header">
        <h2 class="header-title">考题类型管理</h2>
        <span class="layui-breadcrumb pull-right">
          <a href="#!console">首页</a>
          <a><cite>考题类型管理</cite></a>
        </span>
    </div>
    <div class="layui-card-body">
        <div class="layui-form toolbar">
            类型：
            <input id="type-name" class="layui-input search-input" type="text" placeholder="输入关键字"/>
            状态:
            <select id="type-status">
                <option value="">-状态-</option>
                <option value="1">使用</option>
                <option value="2">禁用</option>
            </select>&emsp;&emsp;
            <button id="questions-type-btn-search" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
            <button id="questions-type-btn-add" class="layui-btn icon-btn">添加</button>
        </div>
    </div>
    <div class="layui-card-body" id="questions-type-div">
        <table class="layui-table" id="questions-type" lay-filter="questions-type-filter"></table>
    </div>
</div>

<!-- 表格操作列 -->
<script type="text/html" id="questions-type-table-bar" >
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="type-edit">修改</a>
</script>


<script>
    layui.use(['form', 'table','admin','layer'], function () {
        var table = layui.table;
        var config = layui.config;
        var admin = layui.admin;

        // 渲染表格
        table.render({
            elem: '#questions-type',
            url: config.base_server + 'api-exam/questionType/findAll',
            method: 'get',
            where: {
                access_token: config.getToken().access_token,
            },
            page: true,
            height:'full-350',
            cols: [[
                {type: 'numbers' },
                {field: 'tpname', title: '类型名'},
                {field: 'cretim', title: '创建时间'},
                {field: 'updtim', title: '创建时间'},
                {field: 'status',width:100, title: '状态',
                    templet:function (data) {
                        if(data.status==1){
                            return '<span class="layui-badge layui-bg-gray">使用</span>';
                        }else {
                            return '<span class="layui-badge layui-bg-orange">禁用</span>';
                        }
                    }
                },
                {align: 'center', toolbar: '#questions-type-table-bar', title: '操作', width: 250}
            ]],
            limit:20,
        });

        table.on('tool(questions-type-filter)', function (obj) {
            var data = obj.data;
            var layEvent = obj.event;
            if (layEvent === 'type-edit') { // 编辑
                typeEdit(data)
            }
        });

        //修改
        var typeEdit = function (data) {
            admin.putTempData('type_data', data);
            admin.popupCenter({
                title: '类型修改',
                area: ['20%','30%'],
                path: 'pages/exam/questions-type-edit.html',
                finish: function () {
                    table.reload('questions-type');
                }
            });
        };
        //条件搜索
        $("#questions-type-btn-search").click(function () {
            let status = $("#type-status").val();
            let tpname = $("#type-name").val();
            console.log(status,tpname)
            table.reload('questions-type', {where: {status: status, tpname: tpname}});
        });
        //添加
        $("#questions-type-btn-add").click(function () {
            admin.popupCenter({
                title: '类型新增',
                area: ['30%','20%'],
                path: 'pages/exam/questions-type-add.html',
                finish: function () {
                    table.reload('questions-type');
                }
            });
        });
    });
</script>